<template>
<div ref="myChart" id="myChart"></div>
</template>
<script>
import * as echarts from 'echarts'
export default {
mounted(){
	let myChart = echarts.init(this.$refs.myChart)
	let option = {
		title:{
			text:'雷达图'
		},
		tooltip:{},
		radar:[
			{
				shape:'circle',//默认是多边形
				indicator:[
					//雷达图的指示器，用来指示雷达图中的多个变量(维度)
					{name:'蔬菜',max:6500},
					{name:'水果',max:16500},
					{name:'熟食',max:7500},
					{name:'数码',max:8500},
					{name:'家电',max:5000},
					{name:'日化',max:3500},
					{name:'美妆',max:8500},
				],
				radius:100,//设置半径
				// startAngle:180,//坐标系的起始角度
				splitNumber:3,//雷达图内部的结构层级
				axisName:{
					formatter:"{value}",
					color:"red",
				},//雷达图各级名称设置
			splitArea:{
				//分割区域样式的设置
					areaStyle:{
					color:['red','green','blue'],//各分区的颜色
					shadowColor:'0,0,0,.2',
					shadowBlur:10
				}
			}
			}
		],
		series:[
			{
				type:'radar',
				data:[
					{
						value:[4200,5300,6666,2345,1234,1288,4500],
						areaStyle:{
							color:'black'
						}//包围的区域颜色
						}
				],
				lineStyle:{
					type:'dashed'
				}
			}
		]

	}
	myChart.setOption(option)
}
}
</script>
<style scoped>
#myChart{
	width: 500px;
	height: 500px;
	border:1px solid red;
}
</style>
